{if $related_goods && count($related_goods) > 0}
<div class="lg:w-1/4 bg-white">
    <div id="related-goods-sidebar" class="rounded-sm overflow-hidden bg-gradient-to-b from-white to-gray-50 ">
        <div class="px-6 bg-gradient-to-b from-white to-gray-50 border-b border-gray-200">
            <h3 class="text-lg font-semibold text-gray-800 py-3">相关推荐</h3>
        </div>
        <div class="p-4">
            <div class="space-y-4">
                {volist name="related_goods" id="item" key="index"}
                {if $index <= 5} <div
                    class=" rounded-sm overflow-hidden  transition-shadow">
                    <a href="{$item.url}" class="block">
                        <div class="flex gap-3 p-3">
                            <div class="flex-shrink-0">
                                <img src="" data-src="{$item.image}" alt="{$item.name}"
                                    class="w-20 h-10 object-cover rounded lazy-image">
                            </div>
                            <div class="flex-1 min-w-0">
                                <h4 class="font-medium text-gray-800 text-sm mb-2 line-clamp-2">{$item.name}</h4>
                                <div class="flex items-center justify-between">
                                    {if !empty($item.price)}
                                    <span class="text-blue-500 price-container text-sm font-bold">
                                        <span class="currency-symbol">{:conf('site_currency_symbol')}</span>
                                        <span class="price-number">{$item.price}</span>
                                    </span>
                                    {else}
                                    <span class="text-green-500 font-bold text-sm">免费</span>
                                    {/if}
                                    <span class="text-xs text-gray-500">
                                        <i class="fas fa-eye mr-1"></i><span class="view-count"
                                            data-count="{$item.views|default=0}">{$item.views|default=0}</span>
                                    </span>
                                </div>
                            </div>
                        </div>
                    </a>
            </div>
            {/if}
            {/volist}
        </div>
    </div>
</div>
</div>
{/if}